import React, { useState, useEffect } from 'react'
import { Form, Select } from 'antd'
const { Item } = Form
const { Option } = Select

// 初始化仲裁员map
function initArbitratorMap (arbitrators, setArbitratorMap) {
  const map = {}
  arbitrators.forEach(li => {
    map[li.id] = li
  })
  setArbitratorMap(map)
}

// 改变收件人更新信息
function changeContract (id, arbitratorMap, formRef) {
  const obj = arbitratorMap[id]
  if (!obj) {
    return false
  }
  formRef.current.setFieldsValue({
    contract: obj.name,
    address: obj.structure_address,
    mobile: obj.mobile,
    tel: obj.tel,
    tel_office: obj.structure_tel,
    structure: obj.structure
  })
}

function Main ({ pState, formRef }) {
  const [arbitratorMap, setArbitratorMap] = useState({})
  useEffect(() => {
    initArbitratorMap(pState.arbitrators, setArbitratorMap)
  }, [pState.arbitrators])
  return (
    <Item name='contractid' label='收件人' rules={[{ required: true, message: '收件人不能为空' }]}>
      <Select placeholder='请选择仲裁员' onChange={e => changeContract(e, arbitratorMap, formRef)}>
        {pState.arbitrators.map((li, i) => {
          return (
            <Option key={i} value={li.id}>{li.name}</Option>
          )
        })}
      </Select>
    </Item>
  )
}

export default Main
